<!doctype html>
<html>
<head>
<meta charset="utf-8">
<link href="__PUBLIC__/css/me.css" rel="stylesheet" type="text/css" />
<link href="__PUBLIC__/css/font-awesome.min.css" rel="stylesheet" type="text/css" />

<title>个人主页</title>
</head>

<body>
<div class="big" >
  <header>
  <nav> 
  
  <div class="logo"><a href="#"><i class="fa fa-hourglass-start" aria-hidden="true"></i></a></div>
     <ul>
      <li><a href="#" id="sidebar_trigger">个人信息</a></li>
      <li><a href="#"></a></li>
      <li><a href="#"></a></li>
      <li><a href="#">首页</a></li>
     </ul>
  </nav>
  <div id="banner">
   <div class="inner">
    <h1>奈斯</h1>
    <p class="heading">一切都还好吗</p>
    <button  id="sidebar_trigger2">了解我</button>
    
   </div>
  </div>
 
  </header>
  <div class="content">
  <section class="green-section">
     <div class="wrap">
       <h2>一个标题</h2>
       <div class="hr"></div>
       <p>jshduiashdnsakdmnas;lkjdpasjdi shdnaslkmd;asjiop</p>
     </div>
     <div class="icon-group">
        <span class="icon"><i class="fa fa-user fa-fw"></i></span>
        <span class="icon"><i class="fa fa-camera-retro fa-fw"></i></span>
        <span class="icon"><i class="fa fa-envelope fa-fw"></i></span>
     </div>
   
  </section>
  <section class="gray-section">
  <div class="article">
  
  <div class="text">
   <h2>又一个标题</h2>
   <p>ndoashdoashdlksan,dlnmskl;mdisahjodhsohdouajshdhaedftgfdgfzxcgfdtgaqertreaqdtgdrfgfgxfgfxgxczgzxfgdrf</p>
  </div>
  <div class="image">
   <img src="__PUBLIC__/image/pic01.jpg">
  </div>
  </div>
  <div class="article">
  <div class="image">
   <img src="__PUBLIC__/image/pic02.jpg">
  </div>
  <div class="text">
   <h2>又一个标题</h2>
   <p>ndoashdoashdlksan,dlnmskl;mdisahjodhsohdouajshdadtgrdetrsetgfdfgdftgertrdfgdfgdfgrdegdfgfdgrtgdrgkrgfnjklsdnfkldsnfkldxnfkmxdncmflnxclkjnfjedsnfdsnfklndfmlnxm,flnejksndflskdnflkdsnfkldndoashdoashdlksan,dlnmskl;mdisahjodhsohdouajshdadtgrdetrsetgfdfgdftgertrdfgdfgdfgrdegdfgfdgrtgdrgkrgfnjklsdnfkldsnfkldxnfkmxdncmflnxclkjnfjedsnfdsnfklndfmlnxm,flnejksndflskdnflkdsnfkldndoashdoashdlksan,dlnmskl;mdisahjodhsohdouajshdadtgrdetrsetgfdfgdftgertrdfgdfgdfgrdegdfgfdgrtgdrgkrgfnjklsdnfkldsnfkldxnfkmxdncmflnxclkjnfjedsnfdsnfklndfmlnxm,flnejksndflskdnflkdsnfkldndoashdoashdlksan,dlnmskl;mdisahjodhsohdouajshdadtgrdetrsetgfdfgdftgertrdfgdfgdfgrdegdfgfdgrtgdrgkrgfnjklsdnfkldsnfkldxnfkmxdncmflnxclkjnfjedsnfdsnfklndfmlnxm,flnejksndflskdnflkdsnfkld</p>
  </div>
  </div>
  <div class="article">
  
  <div class="text">
   <h2>又一个标题</h2>
   <p>ndoashdoashdlksan,dlnmskl;mdisahjodhsohdouajshdhaedftgfdgfzxcgfdtgaqertreaqdtgdrfgfgxfgfxgxczgzxfgdrf</p>
  </div>
  <div class="image">
   <img src="__PUBLIC__/image/pic03.jpg">
  </div>
  </div>
  </section>
  <section class="purple-se">
  <div class="heading">
  <h2>标题</h2>
  <div class="hr"></div>
  <div class="sub-heading">
     <P>oishdsoihadkjlsahndkjsnaldjnsajndosjhdosuiaoahdoasjhasdasdsdas</P>
  </div>
  </div>
  <div class="card-grounp  clear">
    <div class="card">
    <h3>标题3</h3>
    <P>soldhsoiuhdsoandksnadjknsduhd</p>
    </div>
    <div class="card">
    <h3>标题3</h3>
    <P>soldhsoiuhdsoandksnadjknsduhd</p>
    </div>
    <div class="card">
    <h3>标题3</h3>
    <P>soldhsoiuhdsoandksnadjknsduhd</p>
    </div>
    <div class="card">
    <h3>标题3</h3>
    <P>soldhsoiuhdsoandksnadjknsduhd</p>
    </div>
    <div class="card">
    <h3>标题3</h3>
    <P>soldhsoiuhdsoandksnadjknsduhd</p>
    </div>
    <div class="card">
    <h3>标题3</h3>
    <P>soldhsoiuhdsoandksnadjknsduhd</p>
    </div>
  </div>
  </section>
  </div>
  <footer>
  <ul class="share-group">
     <li><i class="fa fa-weixin" aria-hidden="true"></i></li>  
     <li><i class="fa fa-qq" aria-hidden="true"></i></li>  
     <li><i class="fa fa-weibo" aria-hidden="true"></i></li>   
  </ul>
  <div class="copy">
  &copy daxian -2016
  </div>
  </footer>
  <div class="mask"></div>
  <div id="sidebar">
      <div class="touxiang"></div>
      <ul>
         <li>昵称：<p>AAA</p></li><br/>
         <li>邮箱：<p>BBB</p></li><br/>
         <li>出生年月:<p>CCC</p></li><br/>
         <li>联系方式：<p>DDD</p</li><br/>
      
      </ul>
  </div>
 <button class="back">返回顶部</button>
<script src="__PUBLIC__/js/jquery-latest.js"></script> 
<script src="__PUBLIC__/js/me.js"></script> 
</body>
</html>
